<!--
    THIS EXAMPLE WAS DOWNLOADED FROM https://echarts.apache.org/examples/zh/editor.html?c=bar-label-rotation&lang=js
-->
<!DOCTYPE html>
<html style="height: 100%">
    <script type="text/javascript" src="static/js/echarts.min.js"></script>
    <head>
        <meta charset="utf-8">
    </head>
    <body style="height: 100%; margin: 0">
    <h1 style="text-align: center">XXX项目管理汇总报表</h1>
    <div id="main" style="height: 100%"></div>



</body>
</html>
<script>
    var main = echarts.init(document.getElementById("main"))
    var option = {
       tooltip: {
            trigger: 'axis',
            axisPointer: {
              // Use axis to trigger tooltip
              type: 'shadow' // 'shadow' as default; can also be 'line' or 'shadow'
            }
       },
        legend: {
            data: {{data1 | tojson}}
        },
         grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true
          },
          xAxis: {
            type: 'value'
          },
          yAxis: {
            type: 'category',
            data: ['2021-02','2021-03','2021-04','2021-05','2021-06','2021-07','2021-08']
          },
        series: [{
            name: {{name1 | tojson}},
            type: 'bar',
            stack:'总量',
            label:{show: true,position:'insideRight'},
            data: {{data3 | tojson}}
            },
            {
                name: {{name2 | tojson}},
                type: 'bar',
                stack:'总量',
                label:{
                show: true, position:'insideRight'},
                data: {{data4 | tojson}}
                },
            {
                name: {{name3 | tojson}},
                type: 'bar', stack:'总量', label:{show: true, position:'insideRight'},
                data: {{data5 | tojson}}
            },
            {
                name: {{name4 | tojson}},
                type: 'bar', stack:'总量', label:{show: true, position:'insideRight'},
                data: {{data6 | tojson}}
            },
            {
                name: {{name5 | tojson}},
                type: 'bar', stack:'总量', label:{show: true, position:'insideRight'},
                data: {{data7 | tojson}}
            },
            {
                name: {{name6 | tojson}},
                type: 'bar', stack:'总量', label:{show: true, position:'insideRight'},
                data: {{data8 | tojson}}
            },
            {
                name: {{name7 | tojson}},
                type: 'bar', stack:'总量', label:{show: true, position:'insideRight'},
                data: {{data9 | tojson}}
            },
            {
                name: {{name8 | tojson}},
                type: 'bar', stack:'总量', label:{show: true, position:'insideRight'},
                data: {{data10 | tojson}}
            },
            {
                name: {{name9 | tojson}},
                type: 'bar', stack:'总量', label:{show: true, position:'insideRight'},
                data: {{data11 | tojson}}
            }]
    };
    main.setOption(option)

</script>